<div class="layui-fluid nepadmin-pad0 nepadmin-mar0 list0" id="VIEW-list-order" lay-title="卡片列表">
  <div class="layui-fluid">
    <div class="layui-row layui-col-space15">
      <div class="layui-col-md12">
        <div class="layui-card">
          <div class="layui-card-body">
			  <div class="test-table-reload-btn" style="margin-bottom: 10px;">
				代理商名：
				<div class="layui-inline">
				  <input class="layui-input" name="agent_name" id="test-table-demoReload" autocomplete="off">
				</div>
				姓名：
				<div class="layui-inline">
				  <input class="layui-input" name="real_name" id="test-table-demoReload2" autocomplete="off">
				</div>
				<button class="layui-btn" data-type="reload">搜索</button>
			  </div>
			<div>
				<button class="layui-btn layuiadmin-btn-list" data-type="batchdel">删除</button>
				<button class="layui-btn layuiadmin-btn-list" data-type="add">添加</button>
			</div>
            <table class="layui-hide" id="test-table-height" lay-filter="test-table-height"></table>
			<script type="text/html" id="test-table-switchTpl">
			  <input type="checkbox" name="sex" lay-skin="switch" lay-text="女|男" lay-filter="test-table-sexDemo"
			   value="{{ d.sex }}" data-json="{{ encodeURIComponent(JSON.stringify(d)) }}" {{ d.sex == 1 ? 'checked' : '' }}>
			</script>
			<script type="text/html" id="test-table-toolbar-barDemo">
			  <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
			            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
			</script>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<style type="text/css">
	
</style>
<script>
	/* var vm=new Vue({
		el:'#VIEW-list-order',
		data:{
			
		}
	}) */
  layui.use(['table','form'], function () {
	  var table = layui.table
	  ,form = layui.form
	  ,$ = layui.$;
    table.render({
      elem: '#test-table-height'
      ,url: 'json/hxr_agent.js'
      ,height: 'full-240'
      ,cellMinWidth: 80
      ,page:true
      ,cols: [[
		{type:'checkbox'}
        ,{field:'agent_name', title: '登录名', width:100}
        ,{field:'real_name', title: '姓名', width:100}
        ,{field:'agent_tel', title: '电话', width:200}
        ,{field:'agent_email', title: '邮箱', width: 200}
        ,{field:'agent_address', title: '住址', align: 'right'}
		,{field:'sex', title:'性别', width:85, templet: '#test-table-switchTpl', unresize: true}
		,{field:'add_time', title: '创建时间', sort: true, width: 200, align: 'right'}
		,{title:'操作', toolbar: '#test-table-toolbar-barDemo', width:150}
      ]]
    });
	//监听性别操作
	form.on('switch(test-table-sexDemo)', function(obj){

	  var json = JSON.parse(decodeURIComponent($(this).data('json')));
	  layer.tips(this.value + ' ' + this.name + '：'+ obj.elem.checked, obj.othis);
	  json = table.clearCacheKey(json);

	});
	//监听行工具事件
	table.on('tool(test-table-height)', function(obj){
	  var data = obj.data;

	  if(obj.event === 'del'){
		layer.confirm('真的删除行么', function(index){
		  obj.del();
		  layer.close(index);
		});
	  } else if(obj.event === 'edit'){
		layui.admin.pupF('编辑用户',['400px', '400px'],'list/listform.html',2,data)
	  }
	});
	var active = {
	      batchdel: function(){
	        var checkStatus = table.checkStatus('test-table-height')
	        ,checkData = checkStatus.data; //得到选中的数据
	
	        if(checkData.length === 0){
	          return layer.msg('请选择数据');
	        }
	      
	        layer.confirm('确定删除吗？', function(index) {
	          
	          //执行 Ajax 后重载
	          /*
	          admin.req({
	            url: 'xxx'
	            //,……
	          });
	          */
	          table.reload('test-table-height');
	          layer.msg('已删除');
	        });
	      }
	      
	      //添加
	      ,add: function(othis){
		   layui.admin.pupF('添加用户',['400px', '400px'],'list/listform.html',1,{})
	      }
	    }; 
		$('.layui-btn.layuiadmin-btn-list').on('click', function(){
		  var type = $(this).data('type');
		  active[type] ? active[type].call(this) : '';
		});
		//搜索
		$('.test-table-reload-btn .layui-btn').on('click', function(){
		  var demoReload = $('#test-table-demoReload'),demoReload2 = $('#test-table-demoReload2');
		  
		  //执行重载
		  table.reload('test-table-height', {
		    page: {
		  	curr: 1 //重新从第 1 页开始
		    }
		    ,where: {
		  	key: {
		  	  agent_name: demoReload.val(),
			  real_name:demoReload2.val()
		  	}
		    }
		  });
		});
  });
</script>